<template>
  <view>
    <view class="comt">
      <view class="cent-pr">
        <view class="cent-pr-l">
          项目
          <view class="cent-pr-t"><!-- （3000万） --></view>
        </view>
        <view class="cent-pr-r">
          <view class="cent-pr-l">
            项目总数
            <view class="cent-pr-t"><!-- （20） --></view>
          </view>
        </view>
      </view>
      <view class="cent-bo">
        <view
          class="cent-bo-b"
          v-for="(item,index) in list" key="item.id" @click="jump('/pages/index/project_list/detail',{id:item.id})">
          <view class="cent-bo-b-l">
            <image :src="item.image" mode="" class="cent-bo-b-img"></image>
          </view>
          <view class="cent-bo-b-r" style="width: 64%;">
            <view class="cent-bo-b-r-t u-ellipsis-1" v-html="item.project_name">
            </view>
            <view class="cent-bo-b-r-b u-ellipsis-2" v-html="item.project_desc">
            </view>
          </view>
        </view>
      </view>
    </view>
	  <u-loadmore :status="loadingType" class="u-p-b-80"></u-loadmore>
  </view>
</template>

<script>
import http from '@/shopro/request/index.js';
	export default {
		data() {
			return {
				page: 1,
				list:[],
				loadingType: 'more', //加载更多状态
			};
		},
		onLoad(){
            this.page = 1
			this.getlist()
		},
		methods:{
			jump(path, parmas) {
				this.$Router.push({
					path: path,
					query: parmas
				});
			},
			getlist(type = 'add', loading) {
				if (type === 'add') {
					if (this.loadingType === 'nomore') {
						return;
					}
					this.loadingType = 'loading';
				} else if (type === 'refresh') {
					this.loadingType = 'loading';
					this.page = 1;
					this.list = [];
				} else {
					this.loadingType = 'more';
				}
				let formData = {
					search:'',
					category: "",
					limit: 10,
					page: this.page,
					token: uni.getStorageSync('token')
				};
				http("project.list", formData).then((res) => {
					console.log(res,res.data.data, 'goods',9999);
						if (res.code === 1) {
							let zhishiList = res.data.data;
							this.page++;
							this.list = this.list.concat(zhishiList);
							this.loadingType = res.data.current_page >= res.data.last_page ? 'nomore' : 'more';
						}
					})
				}
			},
			//加载更多
			onReachBottom() {
				this.getlist();
			}
		}

</script>

<style lang="scss">
page {
  background: #f7f7f7;
}

.comt {
  padding: 0 30rpx;
  .fonts {
    margin: 20rpx 0;
    .font {
      width: 100%;
      height: 300rpx;
      border-radius: 16rpx;
    }
  }
  .cent-pr {
    margin: 33rpx 0 34rpx;
    display: flex;
    justify-content: space-between;

    .cent-pr-l {
      display: flex;
      font-family: PingFang;
      font-weight: bold;
      font-size: 32rpx;
      color: #010101;

      .cent-pr-t {
        color: #666;
      }
    }

    .cent-pr-r {
      display: flex;
      font-family: PingFang;
      font-weight: 500;
      font-size: 28rpx;
      color: #999999;
      line-height: 32rpx;

      .cent-pr-r-t-img {
        width: 14rpx;
        height: 25rpx;
        margin-top: 7rpx;
        margin-left: 10rpx;
      }
    }
  }

  .cent-bo {
    margin-top: 4rpx;
    .cent-bo-b {
      height: 200rpx;
      background: #ffffff;
      border-radius: 16rpx;
      margin-top: 20rpx;
      display: flex;

      .cent-bo-b-l {
        .cent-bo-b-img {
          width: 200rpx;
          height: 140rpx;
          margin: 30rpx 21rpx;
        }
      }

      .cent-bo-b-r {
        .cent-bo-b-r-t {
          margin-top: 30rpx;
          margin-bottom: 35rpx;

          .cent-bo-b-l {
            font-family: PingFang;
            font-weight: bold;
            font-size: 32rpx;
            color: #000000;
            line-height: 30rpx;

            .cent-bo-b-r {
              margin-left: 25rpx;
            }
          }

          .cent-bo-b-r-b {
            font-family: PingFang;
            font-weight: 500;
            font-size: 30rpx;
            color: #666666;
            line-height: 42rpx;
          }
        }
      }
    }
  }
}
</style>

